<!--
 * @Author: ljc
 * @Date: 2023-05-06 10:00:10
 * @LastEditors: g05047
 * @LastEditTime: 2023-05-10 09:52:51
 * @Description: 专家进行微调
-->
<template>
  <rk-dialog width="1200"
    height="700"
    :title="title"
    :visible="visible"
    :destroyOnClose="true"
    @close="visible = false"
    :maskClosable="false">
    <div class="expert-main">
      <div class="expert-left">
        <rk-grid ref="taskMangementRef"
          title="已分配专家"
          dataUrl="/proResApply/reserveProjectPage"
          boxConfig
          :params="queryParams"
          :columns="tableColumns">
        </rk-grid>
      </div>
      <div class="expert-center">
        <div>
          <el-button>上移</el-button>
        </div>
        <div>
          <el-button>下移</el-button>
        </div>
      </div>
      <div class="expert-right">
        <rk-grid ref="taskMangementRef"
          title="待分配专家"
          dataUrl="/proResApply/reserveProjectPage"
          boxConfig
          :params="queryParams"
          :columns="tableColumns">
        </rk-grid>
      </div>
    </div>
    <template #footer>
      <el-button type="primary"
        @click="handleConfirm">保存</el-button>
      <el-button @click="hanldeClose">取消</el-button>
    </template>
  </rk-dialog>
</template>
  
      <script setup>
import { ref } from "vue"

// 查询参数
let queryParams = reactive({
  mhcx: undefined,
  adCode: '231025',
})
const visible = ref(false)
const title = ref('专家微调')
const tableColumns = ref([
  { field: 'fiscalYear1', title: '姓名', width: 120, align: 'center', },
  { field: 'fiscalYear2', title: '姓别', width: 120, align: 'center', },
  { field: 'fiscalYear3', title: '年龄', width: 120, align: 'center', },
  { field: 'fiscalYear4', title: '所属机构', width: 250, align: 'left', },
  { field: 'fiscalYear5', title: '职务', width: 120, align: 'center', },
  { field: 'fiscalYear6', title: '手机号', width: 120, align: 'center', },
  { field: 'fiscalYear7', title: '身份证号', width: 250, align: 'center', },
  { field: 'fiscalYear1', title: '备注', width: 250, align: 'left', },
])
/**查询 */
const handleSearch = () => {

}
/** 打开弹出层 */
const handleOpen = (options) => {
  visible.value = true
}
/** 关闭弹窗 */
const hanldeClose = () => {
  visible.value = false
}

/** 确认提交 */
const handleConfirm = () => {
  visible.value = false
}
// 对外暴露方法
defineExpose({
  handleOpen
})

  </script>
   <style lang="scss" scoped>
.expert-main {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  .expert-left {
    flex: 1;
    height: 0;
  }
  .expert-center {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 50px;
    div {
      text-align: center;
      margin: 20px;
      .el-button {
        width: 100%;
        padding: 20px;
      }
    }
  }
  .expert-right {
    flex: 1;
    height: 0;
  }
}
</style>